<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>可视化餐厅</title>
</head>
<body>
    <div>
      <div style="float: left;width:600px">
          <img src="cook.jpg" style=" vertical-align: middle;width:200px;border-radius: 50%;border:solid 1px red" alt="">
          <span style=" vertical-align: middle;display: inline-block;height:200px;width:200px;border:solid 1px #000">
            厨师<br/>
            <span id="cookStauts">状态：</span>
          </span>
      </div>
      <div style="float: right;">
          <span style=" vertical-align: middle;display: inline-block;height:200px;width:200px;border:solid 1px #000">
              顾客<br/>
              <span id="gName">姓名</span><br/>
              <span id="cookStauts">状态：</span>
              
          </span>
          <img src="guke.png" style=" vertical-align: middle;width:200px;border-radius: 50%;border:solid 1px red" alt="">
      </div>
     
    </div>
    <div style="clear: both"></div>
    <div><img src="waiter.jpg" style="width:200px;border-radius: 50%;border:solid 1px red" alt=""></div>
 
    <div>
        <div>顾客队列</div>
        <div id="duilie"></div>
    </div>
</body>
</html>
<script src="obj_class.js"></script>
<script src="work.js"></script>
<script src="menu.js"></script>
<script src="buyer.js"></script>
<script src="app.js"></script>
<script>
let buyerQueue = document.getElementById('duilie')
console.log(queue.gukeArray)
let name = ''
for(let i=0;i<queue.gukeArray.length;i++){
   name += `<p>${queue.gukeArray[i].name}</p>`
}
buyerQueue.innerHTML = name



</script>
